<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人博客</title>
    <!-- css引入   -->
    <th:block th:include="hander/navigation :: common(~{::links})"></th:block>
    <!--  js引入  -->
    <th:block th:include="/hander/navigation :: commonjs"></th:block>
</head>
<body class="after-body">
<!--  顶部导航栏  -->
<th:block th:replace="/hander/navigation :: navheader" ></th:block>
<div class="row body2">
<!--  二次顶部个人主页个人信息  -->
    <div class="col-md-12 ">
<!--  博主日常信息如获赞量、访问量...  -->
        <div class="leftuserinfo1" >
            <!--  用户头像及站龄 关注  -->
            <div class="after-index1" style="float: left;">
                <div style="width:200px;height: 230px;float: left">
                    <!-- 头像 -->
                    <a th:href="@{/#}"  title="张三">
                        <img th:src="@{/images/index/1.png}" class="img-circle imagesuser1" >
                    </a>
                </div>
                <div class="nickname1">
                    <span>张三</span>
                </div>
                <div class="renzinfo1">
                    <span class="everyday-info">站龄6年</span>&emsp;
                    <span style="font-family: '微软雅黑', '黑体', serif, '宋体'">
                    <img th:src="@{/images/index/renz.png}" width="15px" height="16px">&nbsp;
                    暂无认证
                </span>
                </div>
                <!-- 私信 关注.. -->
                <div style="margin-top: 35px">
                    <button type="button" class="btn btn-default btn-sm" style="width: 60px;" >私信</button>&emsp;
                    <button type="button" class="btn btn-danger btn-sm" style="width: 60px;outline: none;" >关注</button>&emsp;
                </div>
            </div>
            <!-- 个人简介 126中文 -->
            <div class="person-brief" style="float: right">
                <h5 style="color: #7f8087"><b>个人简介</b></h5>
                <textarea style="" cols="42" rows="6"></textarea>

            </div>
            <!-- 博客信息记录 -->
            <!--  原创 获赞 访问 收藏...      -->
            <div class="after-index2 infocount1 " >
                <table align="center" class="blogtable">
                    <tr>
                        <td><a href="#" style="color: #0d1021">51</a></td>
                        <td>51</td>
                        <td>51</td>
                        <td>51</td>
                        <td>51</td>
                    </tr>
                    <tr class="everyday-info">
                        <td><a href="#" style="color: #7f8087">原创</a></td>
                        <td>收藏</td>
                        <td>获赞</td>
                        <td>评论</td>
                        <td>访问</td>
                    </tr>
                </table>
            </div>
            <span class="hx5"></span>
            <!--  粉丝 积分 周排名 总排名 等级... -->
            <div class="after-index2 " style="padding:65px 0px 0 360px ;" >
                <table align="center" class="blogtable">
                    <tr>
                        <td style="padding-left: 4px">51</td>
                        <td style="padding-left: 16px">51</td>
                        <td style="padding-left: 7px">51</td>
                        <td style="padding-right: 5px">51</td>
                        <td style="padding-right: 20px">
                            <img th:src="@{/images/index/class.png}" width="20px" height="22px" />
                        </td>
                    </tr>
                    <tr class="everyday-info">
                        <td style="padding-left: 3px">粉丝</td>
                        <td style="padding-left: 19px">积分</td>
                        <td style="padding-left: 6px">周排名</td>
                        <td style="padding-right: 7px">总排名</td>
                        <td style="padding-right: 15px">等级</td>
                    </tr>
                </table>
            </div>
        </div>
<!--  Search搜索框  -->
        <div class="search-essay1">
            <div class="search1">
                <input type="text" placeholder="搜索博主文章">
                <a th:href="@{/#}"><img th:src="@{/images/index/search.png}" width="30px"  height="40px"></a>
            </div>
        </div>

    </div>
    <!--  左侧个人分类专栏  -->
    <div class="col-md-3" style="padding-right: 0px">
        <div class="leftuserinfo">
            <div style="margin: 0 0 0 58px">
                <ul class="nav nav-pills1 nav-stacked">
                    <li class="active">
                        <span>分类专栏</span>
                        <span class="hx6"></span>
                    </li>
                    <li>
                        <a href="#">
                                <span>
                                    <img th:src="@{/images/index/js.png}" class="tb ">
                                </span>
                            <span>前端</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                                <span>
                                    <img th:src="@{/images/index/after.png}" class="tb ">
                                </span>
                            <span>后端</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                                <span>
                                    <img th:src="@{/images/index/xcx.png}" class="tb ">
                                </span>
                            <span>小程序</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                                <span>
                                    <img th:src="@{/images/index/apple.png}" class="tb ">
                                </span>
                            <span>iOS</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                                <span>
                                    <img th:src="@{/images/index/android.png}" class="tb ">
                                </span>
                            <span>Android</span>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 右侧博客文章 -->
    <div class="col-md-9 " style="padding-left: 0px">
        <!--    内容区域    -->
        <div class="leftuserinfo">
            <!--    标题   -->
            <div class="feed-option">
                <h4  style="margin: 0 0 10px 0">为你推荐</h4>
                <p class="hx2"></p>
            </div>
            <!--      博客      -->
            <div class="news-list">
                <div class="news-item">
                    <a  th:href="@{/navigation/blogdetails}"  >
                        <h4>MyBatis-Plus之代码生成器</h4>
                        <div class="Mytitle">
                            本次我使用的还是低版本2.1.9，目前MyBatis-Plus最新版本为3.3.1。理由很简单，够用。不想盲目的追赶高版本，同时高版本伴随着的不稳定性的存在，企业级应用开发是不允许这
                            前言 计算机网络知识，是面试常考的内容，在实际工作中也常常会涉及到。 最近总结了66条计算机网络相关的知识点，大家一起看一下吧： 1.比较http 0.9和http 1.0😀 http0.9只是一个简单的协议，只有一个GET方法
                        </div>
                    </a>
                    <!--        点赞量 作者 日期       -->
                    <div class="pariseAuth">
                        <a>王康 </a>·
                        <span>2020年5月1日</span>
                        &emsp;
                        <a href="" class="parise">
                            <img th:src="@{/images/index/dz0.png}" width="20px" />
                            <span>点赞</span>
                        </a>
                    </div>
                </div>
            </div>
            <!--            分页          -->
            <div class="plq" style="text-align: center;">
                <ul class="pagination">
                    <li ><a href="#" onclick="s(0)">&laquo;</a></li>
                    <li class="fy active" ><a href="#" onclick="s(0)" >1</a></li>
                    <li class="fy " ><a href="#" onclick="s(1)" >2</a></li>
                    <li class="fy " ><a href="#" onclick="s(2)" >3</a></li>
                    <li class="fy "  ><a href="#" onclick="s(3)" >4</a></li>
                    <li class="fy " ><a href="#" onclick="s(4)" >5</a></li>
                    <li ><a href="#" onclick="s(0+1)" >&raquo;</a></li>
                </ul>
            </div>
        </div>
    </div>
</div>

</body>
</html>